App Icon

Custom app icon configuration for universal apps. Replace the default icons with your branded app icons for a professional appearance in device launchers and app stores on both Android and iOS platforms.

Configuration

App icons are automatically detected and applied when placed in the correct location. No additional configuration is required in your app settings.

Android Icon Setup

File Location

Place your Android launcher icons inside public/android/appIcons.

Each density-specific file must follow the naming pattern icon-{density}.{ext} where {density} is one of:

Density	Filename	Recommended Size (px)
mdpi	icon-mdpi.png	48 x 48
hdpi	icon-hdpi.png	72 x 72
xhdpi	icon-xhdpi.png	96 x 96
xxhdpi	icon-xxhdpi.png	144 x 144
xxxhdpi	icon-xxxhdpi.png	192 x 192

You can provide any subset of these files; the build will automatically consume every matching icon it finds.

Supported File Extensions

• .png
• .jpg
• .jpeg

If no custom icons are present, Catalyst falls back to the bundled default icon so your project continues to build.

iOS Icon Setup

File Location

Place your iOS app icon files in the public/ios/appIcons directory using the following naming convention:

Required naming pattern: icon-{size}-{scale}.{ext}

Required Icon Sizes

Filename	Size (px)	Purpose
icon-20x20-2x.png	40×40	iPhone Notification
icon-20x20-3x.png	60×60	iPhone Notification
icon-29x29-2x.png	58×58	iPhone Settings
icon-29x29-3x.png	87×87	iPhone Settings
icon-40x40-2x.png	80×80	iPhone Spotlight
icon-40x40-3x.png	120×120	iPhone Spotlight
icon-60x60-2x.png	120×120	iPhone App
icon-60x60-3x.png	180×180	iPhone App
icon-1024x1024-1x.png	1024×1024	App Store

Supported Formats

• .png
• .jpg
• .jpeg

File Structure

your-project/
├── public/
│   ├── android/appIcons/     # Android app icons directory
│   │   ├── icon-mdpi.png
│   │   ├── icon-hdpi.png
│   │   ├── icon-xhdpi.png
│   │   ├── icon-xxhdpi.png
│   │   └── icon-xxxhdpi.png
│   └── ios/appIcons/         # iOS app icons directory
│       ├── icon-20x20-2x.png
│       ├── icon-20x20-3x.png
│       ├── icon-29x29-2x.png
│       ├── icon-29x29-3x.png
│       ├── icon-40x40-2x.png
│       ├── icon-40x40-3x.png
│       ├── icon-60x60-2x.png
│       ├── icon-60x60-3x.png
│       └── icon-1024x1024-1x.png
├── src/
└── package.json

Behavior

Android

• No Custom Icons: Uses the Catalyst fallback launcher icon
• With Custom Icons: Automatically applies icons from public/android/appIcons, matching each density-specific file it finds
• Partial Density Set: Missing densities fall back to the nearest available resource provided

iOS

• No Custom Icons: Default iOS icon is displayed
• With Custom Icons: Automatically detects and applies icons from public/ios/appIcons directory
• Partial Icons: Missing icon sizes will use default iOS icons as fallback

Important Notes

• Icon replacement is automatic - no code changes required
• Changes take effect on the next app build
• Default icons are used as fallback if custom icons are not found
• Icons appear in device launchers, app stores, and system settings
• For iOS, ensure all required icon sizes are provided for best compatibility